<script setup>

</script>

<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true"  label-width="68px">

      <el-form-item label="物业名称" prop="pmid">
        <el-select v-model="queryParams.pmid" placeholder="请选择物业名称" @change="clearCarshomeList"
                   clearable>
          <el-option
            v-for="item in this.propertyList"
            :key="item.pmid"
            :label="item.propertyName"
            :value="item.pmid">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="车场名称" prop="hpid">
        <el-select v-model="queryParams.hpid" placeholder="请选择车场名称" @visible-change="getListCars" clearable>
          <el-option
            v-for="item in this.carshomeList"
            :key="item.chid"
            :label="item.chname"
            :value="item.chid">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="车牌号" prop="cartsNum">
        <el-input v-model="queryParams.licenseNumber" placeholder="请输入车牌号码" clearable></el-input>
      </el-form-item>


      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>



    <div v-if="showInfo==0">
      <el-empty :image-size="300" description="请将查询条件填写完毕，以便更好地得到车场下收费情况！！！" ></el-empty>
    </div>
      <el-card v-if="showInfo==1" >
<div >

  <el-descriptions title="停车信息"  :column="2" colon:true >
    <el-descriptions-item label="流水号">{{this.carsMsgList.crid}}</el-descriptions-item>
    <el-descriptions-item label="车牌号">{{this.carsMsgList.carsMsg.licenseNumber}}</el-descriptions-item>
    <el-descriptions-item label="车牌颜色">   {{this.carsMsgList.carsPlateColors.carsPlateName}}</el-descriptions-item>
    <el-descriptions-item label="停车时长/分">
      <el-tag size="small">{{minus}}</el-tag>
    </el-descriptions-item>
    <el-descriptions-item label="入场时间">{{this.carsMsgList.intoTime}}</el-descriptions-item>
    <el-descriptions-item label="出场时间">{{this.carsMsgList.outsideTime}}</el-descriptions-item>
    <el-descriptions-item label="车辆类型">{{this.carsMsgList.carsType.typeName}}</el-descriptions-item>
  </el-descriptions>


  <el-descriptions title="车场信息"  :column="2" colon:true>
    <el-descriptions-item label="物业名称">{{ this.carsMsgList.propertyManagement.propertyName }}</el-descriptions-item>
    <el-descriptions-item label="停车场名称">{{ this.carsMsgList.carsHome.chname }}</el-descriptions-item>

  </el-descriptions>


  <el-descriptions title="进出场基本信息"  :column="2" colon:true>
    <el-descriptions-item label="入场车道">{{this.carsMsgList.carsHomeEqChukou.carsHomeLane.lanename}}</el-descriptions-item>
    <el-descriptions-item label="出场车道">{{this.carsMsgList.carsHomeEqChukou.carsHomeLane.lanename}}</el-descriptions-item>
    <el-descriptions-item label="入场设备">   {{this.carsMsgList.carsHomeEq.eqname}}</el-descriptions-item>
    <el-descriptions-item label="出场设备">   {{this.carsMsgList.carsHomeEqChukou.ckname}}</el-descriptions-item>

    <el-descriptions-item label="入场设备IP">{{this.carsMsgList.carsHomeEq.eqip}}</el-descriptions-item>
    <el-descriptions-item label="出场设备IP"> {{this.carsMsgList.carsHomeEqChukou.ckip}}</el-descriptions-item>
  </el-descriptions>

  <el-form :inline="true" :model="rule" class="demo-form-inline">
    <el-form-item label="计费规则">
      <el-select v-model="rule.chtrid" placeholder="计费规则" clearable @change="clouse">
        <el-option label="按次收费" value="1"></el-option>
        <el-option label="按分钟计费" value="2"></el-option>
        <el-option label="按天计费" value="3"></el-option>
      </el-select>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="getPay">计算费用</el-button>
      <el-button type="primary" @click="Pay" :disabled="canPay">支付费用</el-button>
    </el-form-item>
  </el-form>

  <el-row v-show="showPay">
    <el-col :sm="12" :lg="6">
      <el-result :icon="message" :title="message2" :subTitle="maney">
      </el-result>
    </el-col>
    </el-row>

</div>





</el-card>

  </div>
</template>
<script>
import {listHome} from "@/api/modules/sys-cars-home/home";
import {listProperty, stopCars} from "@/api/modules/sys-property/property";
import {listCars} from "@/api/pxy-cars/cars";
import {listRules} from "@/api/modules/sys-cars-home/carshomerules/rules";
import {listTime} from "@/api/modules/sys-cars-home/api/time";
import {listMinute} from "@/api/modules/sys-cars-home/api/minute";
import {listDay} from "@/api/modules/sys-cars-home/api/day";

export default {
  name: "wuliao",
  data() {
    return {


      // 查询参数
      queryParams: {
        pmid: null,
        hpid: null,
        licenseNumber:null
      },

      queryParams2: {
        pmid: null,
        hpid: null
      },

      rule:{
        chid:null,
        lpcid:null,
        chtrid:null,
        carsTypeid:null,
      },

      // 车场管理表格数据
      carshomeList: [],

      ruleList:[],
      // 物业数据
      propertyList: [],
      carsMsgList:[],
      minus: '',
      showInfo:0,

      queryRules:{
        code:null,
      },
      TimeList:[],
      MinuteList:[],
      DayList:[],

      showPay:false,
      maney: '',
      message:'',
      message2:'',

      payList:{
        licenseNumber: null,
        money:null,
        chid:null
      },
      canPay:true

    };

  },

  created() {
    this.getListProperty()
  },

  methods: {



    /** 查询车场管理列表 */
    getListCars() {
      this.queryParams2.pmid = this.queryParams.pmid
      listHome(this.queryParams2).then(response => {
        this.carshomeList = response.rows;
      });

    },

    getCarsMsg(){
      this.loading = true;
      listCars(this.queryParams).then(response => {
        if(response.rows.length==1){
          this.carsMsgList = response.rows[0];
          this.showInfo=1
        }
        this.feng()
        this.loading = false;
      });



    },
    feng() {
      if (this.carsMsgList.outsideTime != null && this.carsMsgList.intoTime) {
        const s2 = this.carsMsgList.outsideTime
        const s1 = this.carsMsgList.intoTime
        const t1 = Date.parse(s1.replace(/-/g, '/'))
        const t2 = Date.parse(s2.replace(/-/g, '/'))
        const minu = (t2 - t1) / 1000 / 60
        const minus = Math.floor(minu);
        return this.minus = minus
      } else {
        return ""
      }
    },

    /** 查询物业列表 */
    getListProperty() {
      this.loading = true;
      listProperty(null).then(response => {
        this.propertyList = response.rows;
        this.loading = false;
      });
    },

    //清除车场
    clearCarshomeList() {
      this.queryParams2.pmid = this.queryParams.pmid
      this.queryParams.hpid = null
      this.getListCars()
    },

    /** 搜索按钮操作 */
    handleQuery() {
      console.log("*****")
      if(this.queryParams.pmid!=null && this.queryParams.hpid!=null && this.queryParams.licenseNumber!=null){
        this.getCarsMsg();
      }else {
        this.$modal.msgSuccess("请输入完整查询条件");
        this.showInfo=0
      }

    },
    /** 重置按钮操作 */
    resetQuery() {
      // this.resetForm("queryForm");
      this.queryParams.pmid=null
      this.queryParams.hpid=null
      this.queryParams.licenseNumber=null
      this.handleQuery();
    },

    onSubmit() {
      console.log('submit!');
    },



    async getPay() {
      this.maney=''
    this.TimeList=[]
    this.MinuteList=[]
    this.DayList=[]


      this.rule.chid = this.carsMsgList.carsHome.chid;
      this.rule.carsTypeid = this.carsMsgList.carsType.ctid;
      this.rule.lpcid = this.carsMsgList.carsPlateColors.lpcid;

      try {
        const res = await listRules(this.rule);
        this.ruleList = res.rows[0];


        this.queryRules.code = this.ruleList.rulesTxt;
        if (this.rule.chtrid === "1") {
          // 按此收费
          console.log("本次按此收费")
          const res = await listTime(this.queryRules);
          this.TimeList = res.rows[0];
           this.maney = (this.TimeList.amount).toString();
        } else if (this.rule.chtrid === "2") {
          // 按分钟收费
          console.log("按分钟收费")
          const res = await listMinute(this.queryRules);
          this.minuteList = res.rows[0];

          if (parseInt(this.minus) / 1440 < 1) {
            let my = (Math.floor((this.minus - this.minuteList.freeMinute - this.minuteList.beginMinute) / this.minuteList.thanMinute)+1) * this.minuteList.getMoney + this.minuteList.beginMoney;
             this.maney = (my > this.minuteList.maxMoney ? this.minuteList.maxMoney : my).toString();
          } else {
            let onMy = (Math.floor(parseInt(this.minus) / 1440) * this.minuteList.maxMoney);
            let upMy = (((parseInt(this.minus)%1440) - this.minuteList.freeMinute - this.minuteList.beginMinute) / (this.minuteList.thanMinute * this.minuteList.getMoney) + this.minuteList.beginMoney).toFixed(2);
            this.maney = (parseInt(upMy) > this.minuteList.maxMoney ? (this.minuteList.maxMoney + onMy) : (parseInt(upMy) + onMy)).toString();
            console.log(this.maney)
          }
        } else if (this.rule.chtrid === "3") {
          // 按天收费
          console.log("按天收费")
          const res = await listDay(this.queryRules);
          this.dayList = res.rows[0];
          if (parseInt(this.minus) <= this.dayList.freeMinute) {
            this.maney = 0;
          } else {
            let day = Math.floor(parseInt(this.minus) / 1440);
            let upday = parseInt(this.minus) % 1440;
             this.maney = (upday <= this.dayList.freeMinute ? day * this.dayList.dayMoney : (day + 1) * this.dayList.dayMoney).toString();
          }
        }
      } catch (error) {
        this.showPay=false
        console.error("获取规则列表失败:", error);
      }

      if(this.maney!=''){
        this.message="success"
        this.message2="成功提示"
        this.showPay=true;
        this.canPay=false;
      }else {
        this.message='error'
        this.message2='尚未配置收费规则!'
        this.showPay=true;
        this.canPay=true;
      }

    },

    Pay(){
      this.payList.licenseNumber=this.queryParams.licenseNumber;
      this.payList.chid=this.queryParams.pmid;
      this.payList.money=this.maney;

      stopCars(this.payList).then(res=>{
        if(res.code==200){
          this.$message({
            message: '支付成功!',
            type: 'success'
          });
        }else {
          this.$message({
            message: '支付失败!',
            type: 'error'
          });
        }
      })

    },

    clouse(){

      this.showPay=false
    }
  },


}


</script>
<style scoped lang="scss">

</style>
